// 表单样式
.el-form {
  // margin-bottom: 10px;

  &.inline {
    display: flex;
    flex-wrap: wrap;
  }

  &.delicate {
    margin-bottom: 20px;

    .el-form-item {
      margin-bottom: 0;
    }
  }

  &.full {
    width: 100%;

    .el-form-item {
      width: 100%;
    }
  }

  .el-form-item {
    display: flex;
    margin: 0 0 20px 0;

    &:first-of-type {
      margin-top: 0;
    }

    &:last-of-type {
      margin-bottom: 0;
    }

    &.el-form-item--mini {
      margin: 0 10px 10px 0;
    }

    &.last-item {
      margin: 0;
      flex-grow: 1000;

      .el-form-item__content {
        width: auto;
        display: flex;
        align-items: flex-end;

        > * {
          margin-bottom: 10px;
        }
      }
    }

    &.con-item {
      &:first-of-type {
        margin-top: 0;
      }
    }

    &.many {
      .el-form-item__label {
        // align-items: center;
        // padding: 0;
      }
    }

    .el-form-item__label {
      user-select: none;
      color: #000;
      font-size: 12px;
      line-height: 1;
      display: flex;
      align-items: flex-start;
      justify-content: flex-end;
      padding: 10px 0 0 0;
      margin-right: 10px;
      position: relative;
      flex-shrink: 0;

      span {
        text-align: right;
        text-align-last: right;
        display: flex;
        justify-content: flex-end;
        // flex-grow: 20;
        flex-shrink: 0;
        &::before {
          margin: 0 !important;
          display: flex;
          justify-content: flex-end;
          flex-shrink: 2;
          flex-grow: 100;
        }

        &::after {
          content: ':';
          display: block;
          width: 10px;
          flex-shrink: 0;
          text-align: center;
        }
      }

      // &::before {
      //   margin: 0 !important;
      //   display: flex;
      //   justify-content: flex-end;
      //   flex-shrink: 2;
      //   flex-grow: 100;
      // }

      // &::after {
      //   content: ":";
      //   display: block;
      //   width: 10px;
      //   flex-shrink: 0;
      //   text-align: center;
      // }
    }

    .el-form-item__content {
      margin-left: 0 !important;
      font-size: 12px;
      line-height: 1;
      overflow: hidden;
      flex-grow: 1000;
      user-select: none;

      .tip-after {
        line-height: 1.8;
        display: block;
        width: 300px;
      }

      .table-main {
        padding: 0;
      }

      .right-parent {
        display: flex;
        // flex-wrap: wrap;
        width: 100%;

        .tip-right {
          width: auto !important;
          padding: 8px 0 0 5px;
          text-align: left;
          // flex-shrink: 0;
        }

        .bottom-parent {
          max-width: 100%;
          overflow: hidden;

          > * {
            width: 300px;
            max-width: 100%;
          }
        }
      }
    }

    &.newLine {
      margin-right: 100%;
      flex-shrink: 0;
    }

    &.full {
      margin-right: 0;

      > .el-form-item__content {
        .right-parent {
          display: flex;

          .bottom-parent {
            flex-grow: 1000;

            > * {
              width: 100%;
            }
          }
        }

        .ck-content {
          min-height: 150px;
        }
      }
    }
    &.notxt-full {
      margin-right: 0;
      > .el-form-item__label {
        user-select: none;
        color: #000;
        font-size: 12px;
        line-height: 1;
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
        padding: 10px 0 0 0;
        margin-right: 10px;
        position: relative;
        flex-shrink: 0;

        span {
          text-align: right;
          text-align-last: right;
          display: flex;
          justify-content: flex-end;
          flex-grow: 20;
          flex-shrink: 0;
        }

        &::before {
          margin: 0 !important;
          display: flex;
          justify-content: flex-end;
          flex-shrink: 2;
          flex-grow: 100;
        }

        &::after {
          content: '' !important;
          display: block;
          width: 10px;
          flex-shrink: 0;
          text-align: center;
        }
      }

      > .el-form-item__content {
        .right-parent {
          display: flex;

          .bottom-parent {
            flex-grow: 1000;

            > * {
              width: 100%;
            }
          }
        }

        .ck-content {
          min-height: 150px;
        }
      }
    }

    &.big {
      > .el-form-item__content {
        .right-parent {
          display: flex;

          .bottom-parent {
            > * {
              width: 800px;
            }
          }
        }
      }
    }

    &.imageSize {
      width: 670px;
    }
  }
}
